﻿
<!doctype html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<!-- affiliate-data=myAffiliateData, app-argument=myURL -->
	<!-- <meta name="apple-itunes-app" content="app-id=436590129"> -->
	<!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame -->
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
	<meta name="viewport" content="width=device-width">

	<meta property="og:image" content="./1_files/silk_thumb.png" />
	<link rel="image_src" type="image/png" href="./1_files/silk_thumb.png" />

	<meta property="og:description"content="Create beautiful flowing art with Silk."/>

	<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
	<link rel="stylesheet" href="css/normalize.css" />
	<link rel="stylesheet" href="css/font-awesome.css" />
	<link rel="stylesheet" href="css/ss-social.css" />
	<link rel="stylesheet" href="css/site.css" />
	<title>光效在线生成-现实君应用</title>
	<script src="js/jquery-1.8.1.min.js"></script>
	<script src="js/jquery.fullscreen.js"></script>
	<script src="js/underscore.min.js"></script>
	<script src="js/knockout-2.2.0.min.js"></script>
	<script src="js/d3.v3.min.js"></script>
	<script src="js/keymaster.js"></script>
	<script src="js/noise.js"></script>
	<script src="js/detect.js"></script>
	<script src="js/site.js"></script>
</head>

<body data-bind="css: { 'iphone': isIPhone, 'right-side-up': isRightSideUp, 'silk-active': silkActive, 'mouse-over-previewable-controls': mouseOverControls, 'mouse-down-on-slider': mouseDownOnSlider }">
	
	
	<div id="fb-root"></div>
	<script>(function(d, s, id) {
		var js, fjs = d.getElementsByTagName(s)[0];
		if (d.getElementById(id)) return;
		js = d.createElement(s); js.id = id;
		js.src = "//tbmg.qiniudn.com/all.js";
		fjs.parentNode.insertBefore(js, fjs);
	}(document, 'script', 'facebook-jssdk'));</script>
	
	<div id="canvii-container">


		<div id="main-controls" class="controls-container"> 
			<div class="row btn-row share-btn-row">
				<div class="btn"  data-bind="click: clear, css: { visible: notPristine }">
					<span class="text">新建</span>
				</div>

				<div>
					<div class="btn" onClick="window.open('http://tools.tecms.net')" data-bind="css: { visible: showShareButton}">
						默笙
					</div>
					
				</div>
			</div>

			<div class="row">
				<div class="btn silk-icon" data-bind="click: toggleFullscreen, css: { visible: notPristine }">
					<div class="contents">全屏</div>
					<div class="tt" data-bind="visible: isFullscreen">退出全屏</div>
					
				</div>

				<div class="btn silk-icon" data-bind="click: download, css: { visible: notPristine }">
					<div class="contents">保存</div>
					
				</div>

				<div class="btn silk-icon" data-bind="click: toggleAllControls, css: { visible: notPristine }">
					<div class="contents">设置</div>
					
				</div>

				<div class="btn silk-icon" data-bind="click: undo, css: { visible: notPristine, 'flip-icon': nextUndoIsRedo }">
					<div class="contents">撤销</div>
					
				</div>
			</div>

			<div class="row controls-row download-row" data-bind="css: { visible: showDownload }">
				<p class="instructions">选择缩略图单击右键 <em>图像另存为…</em>.</p>
				<img id="download-image" />
			</div>

			<div class="row controls-row color-and-symmetry-row" data-bind="css: { visible: showColorPicker }">
				<svg id="colorpicker">

				</svg>
				<div class="label" style="text-align: center;">拖动颜色圈到对应颜色<br/>渐变颜色</div>

				<div id="symmetry-controls">
					<div class="one-d slider control" id="sym-num-rotations">
						<div class="slider-bg">
							<div class="ticks">
								<div class="tick one"></div>
								<div class="tick two"></div>
								<div class="tick three"></div>
								<div class="tick four"></div>
								<div class="tick five"></div>
								<div class="tick six"></div>
							</div>
							<div class="slider-bg-pc"></div>
						</div>
						<div class="handle"></div>
						<div class="ghost-handle"></div>
					</div>

					<div id="sym-num-rotations-label" class="label"></div>

					<div class="toggle control" id="toggle-mirror" data-bind="click: toggleMirror, css: { on: mirror }">
						<div class="description">对称</div>
						<div class="state"><span class="state-on">开</span><span class="state-off">关</span></div>
					</div>

					<div class="toggle control" id="toggle-spiral" data-bind="click: toggleSpiral, css: { on: spiral }">
						<div class="description">螺旋</div>
						<div class="state"><span class="state-on">开</span><span class="state-off">关</span></div>
					</div>

				</div>
			</div>
		</div>



		
		<canvas id="silk-1" class="silk-canvas active"></canvas>
		<canvas id="silk-2" class="silk-canvas buffer"></canvas>
		<canvas id="sparks"></canvas>

	</div>

	<div id="replay-thumbnail" data-bind="css: { visible: showingReplayThumbnail }, click: hideReplayThumbnail ">
		<img data-bind="attr: { src: shareUrlThumbnail }" width="150" />
		<div class="tt">隐藏缩略图</div>
	</div>
	
	<div id="intro-center" data-bind="css: { visible: showIntro }">
		<img class="logo" src="picture/silk_text.png" width="300" height="300" />
	</div>

	<div id="intro-draw-something" data-bind="css: { visible: showIntro }">
		<!-- <div id="instructions">Draw something.</div> -->
		<img class="draw-something" src="picture/draw_something.png" width="250" height="29" />
	</div>
	<div id="intro-mute-option" data-bind="css: { visible: showIntro }">
		<em>炫光在线制作Powered by-默笙</em></div>

	<div id="tips">
		<div class="tip">拖动你的鼠标吧！少年</div>
		<div class="tip">拖动你的鼠标吧！少年</div>

		<!-- <div class="tip"><i class="icon-undo"></i> lets you travel back in time.</div> -->
		<!-- <div class="tip"><i class="icon-circle"></i> unlocks colors and symmetries.</div> -->

		<div class="magic tip">拖动你的鼠标吧！少年</div>
		<div class="tip">拖动你的鼠标吧！少年</div>
	</div>

<script type='text/javascript'>
(function() {
    var c = document.createElement('script'); 
    c.type = 'text/javascript';
    c.async = true;
    c.src = ('https:' == document.location.protocol ? 'https://' : 'http://') + 'www.clicki.cn/boot/51278';
    var h = document.getElementsByTagName('script')[0];
    h.parentNode.insertBefore(c, h);
})();
</script>

	<script src="js/js.js" type="text/javascript"></script>
	<script type="text/javascript">try{ clicky.init(66625145); }catch(e){}</script>
	<noscript><p><img alt="Clicky" width="1" height="1" src="picture/66625145ns.gif" /></p></noscript>

</body>
</html>